<head>
  <meta charset="utf-8">

  <title><%= title %></title>

  <meta name="description" content="<%=description%>">
  <meta name="author" content="<%=author%>">

  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <!-- REVEAL CSS-->
  <link rel="stylesheet" href="libs/reveal.js/font-awesome-4.7.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="libs/reveal.js/3.8.0/css/reveal.css">
  <% if (theme) { %>
  <link rel="stylesheet" href="libs/reveal.js/3.8.0/css/theme/<%=theme%>.css" id="theme">
  <%}%>
  
  <link rel="stylesheet" href="libs/reveal.js/3.8.0/plugin/title-footer/title-footer-mod.css" />

  <!-- MERMAID-->
  <script src="libs/reveal.js/3.8.0/plugin/mermaid/mermaid.min.js"></script>
  <style>
  .mermaid {
    font-size: 0.5em;
  }
  </style>

  <style>
    [class*=task-list-item] {
    min-height: 22px;
    margin-top: 6px!important;
    margin-bottom: 6px!important;
    padding-left: 0;
    list-style: none;
}

[class*=task-list-item]>input:first-child {
    position: absolute!important;
    opacity: 0;
    margin: 0;
}
[class*=task-list-item]>label {
    padding-left: 29px!important;
    min-height: 22px;
    line-height: 22px;
    display: inline-block;
    position: relative;
    vertical-align: top;
    margin-bottom: 0;
    font-weight: 400;
    cursor: pointer;
}

.task-list-item>input:first-child:checked+input[type=hidden]+label::before, .task-list-item>input:first-child:checked+label::before {
    background-color: #ecf0f1;
    border-color: #ecf0f1;
}

[class*=task-list-item]>input:first-child+input[type=hidden]+label::before, [class*=task-list-item]>input:first-child+label::before {
    content: "";
    display: inline-block;
    position: absolute;
    width: 22px;
    height: 22px;
    border: 1px solid #D3CFC8;
    border-radius: 0;
    margin-left: -29px;
}


[class*=task-list-item]>input:first-child:checked+input[type=hidden]+label::after, [class*=task-list-item]>input:first-child:checked+label::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    width: 7px;
    height: 10px;
    border: 2px solid #fff;
    border-left: none;
    border-top: none;
    transform: translate(7.75px,4.5px) rotate(45deg);
    -ms-transform: translate(7.75px,4.5px) rotate(45deg);
}


.task-list-item>input:first-child:checked+input[type=hidden]+label::after, .task-list-item>input:first-child:checked+label::after {
    border-bottom-color: #95a5a6;
    border-right-color: #95a5a6;
}
  </style>

  <!-- Theme used for syntax highlighting of code -->
  <% if (highlightTheme) { %>
  <link rel="stylesheet" href="libs/highlight.js/9.15.10/<%=highlightTheme%>.css">
  <%} else {%>
  <link rel="stylesheet" href="libs/reveal.js/3.8.0/lib/css/monokai.css">
  <%}%>

  <% if (customTheme) { %>
  <link rel="stylesheet" href="<%=customTheme%>.css">
  <%}%>
  
  <!-- Printing and PDF exports -->
  <script>
    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = window.location.search.match(/print-pdf/gi) ? 'libs/reveal.js/3.8.0/css/print/pdf.css' : 'libs/reveal.js/3.8.0/css/print/paper.css';
    document.getElementsByTagName('head')[0].appendChild(link);
  </script>

  <style>
     .line {
      display: block;
    }
    

    .line.focus {
      background: #fdf6e3;
      color: #657b83;
    }

    .reveal .slides section .fragment.current-only {
      visibility: visible;
      display: none;
    }

    .reveal .slides section .fragment.current-only.current-fragment {
      display: block;
    }

    .line.focus {
       opacity: 1.0;
    } 

    @media (device-width: 100vw) and (device-height: 100vh) {
      .reveal pre code {
        max-height: 50vh !important;
      }
    }

    #logo img {
      max-height: 3.5em;
      max-width: none;
      min-width: 50px;
    }

    .reveal .slides section .code-presenting-annotation {
      color: white;
      background: black;
      padding: 0px 15px;
      border-radius: 15px;
      opacity: 0.75 !important;
      font-size: 50% !important;
    }
  </style>
  <script>
    if (window.location.search.match(/print-pdf-now/gi)) {
      window.print();
    }
  </script>
</head>